<template>
  
  <div class="login">
        <el-card class="box-card">
          <div slot="header" class="clearfix">
            <span>登录</span>
          </div>
          <div >
            <el-form ref="form" :model="form" label-width="180px">
              <el-form-item label="用户名/手机号">
                <el-input v-model="form.username"></el-input>
              </el-form-item>
              <el-form-item label="密码">
                <el-input show-password=true v-model="form.password" type="password"></el-input>
              </el-form-item>
              <el-form-item label-position="left">
                <el-button type="primary" @click="login()">提交</el-button>
            </el-form-item>
          </el-form>
          </div>
    </el-card>

  </div>
  </template>

<script>
import { setToken } from '@/utils/auth' 
export default {
  name: 'Login',
  created:function(){
    console.log("login");
  },
  data(){
    return {
      showPassword:false,
      form:{
        username:null,
        password:null
      }

    }
  },
  methods:{
    login(){
        this.$api.login(this.form).then((res)=>{
          debugger;
          if(res.code==0){
            setToken(res.data.token);
            this.$router.push("/home");
          }else{
            this.$message({
                message: res.msg,
                type: 'error'
          });
          }
      
        })
     
    }

  }
}
</script>
<style scoped>
.login{
  width: 600px;
	height: 350px;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
}
</style>